import { SkuPopupInstance } from "@/types/component";
import { SkuPopupLocaldata } from "@/types/vk-data-goods-sku-popup";
import { computed, ref } from "vue";

// sku组件hook
export const useSkuPopup = () => {
    // sku组件实例
    const skuPopupRef = ref<SkuPopupInstance>();

    // 选中商品规格
    const skuText = computed(() => {
        const text = skuPopupRef.value?.selectArr?.join(' ');
        return text?.trim() ? text : '请选择商品规格';
    });

    // 是否开启sku展示
    const showSku = ref(false);

    // 商品sku信息
    const skuData = ref<SkuPopupLocaldata>();

    // sku面板开启类型
    enum SkuOpenMode { Both = 1, Cart, Buy }
    const skuMode = ref<SkuOpenMode>(SkuOpenMode.Both);

    // 打开sku面板
    const openSkuPopup = (mode: SkuOpenMode) => {
        showSku.value = true;
        skuMode.value = mode;
    };

    return { skuPopupRef, skuText, showSku, skuData, skuMode, openSkuPopup };
};